<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <link href="css/index.css" type="text/css" rel="stylesheet" />
    <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/5.12.1/css/all.min.css">
    <script src="js/index.js" type="text/javascript"></script>
</head>
<body>

    <div class="header">

        <div class="header_inner">
            <div class="header_left">
                <ul>
                    <li>主站 <i class="fa fa-chevron-down" style="font-size: 9px;"></i></li>
                    <li>番剧</li>
                    <li>游戏中心</li>
                    <li>直播</li>
                    <li>会员购</li>
                    <li>漫画</li>
                    <li>赛事</li>
                    <li><i class="fa fa-mobile"></i>下载APP</li>
                </ul>
            </div>
            <div class="header_center">
                <form action="" method="post">
                    <div class="search_form">
                        <input type="search" placeholder="青春有你2主题曲"/>
                        <button><i class="fa fa-search"></i></button>
                    </div>
                </form>
            </div>
            <div class="header_right">
                <ul>
                    <li><img src="img/ea5b2d22b08bc798560189ed1661293e4f33728a.jpg@70w_70h_1c_100q.webp"/></li>
                    <li>大会员</li>
                    <li>消息</li>
                    <li>动态</li>
                    <li>收藏</li>
                    <li>历史</li>
                    <li>创作中心</li>
                    <li><span class="span_button">投稿</span></li>
                </ul>
            </div>
        </div>

    </div>

    <div class="body">
        <div class="body_wrap">
            <div class="body_left">
                <div class="box">
                    <h1 title="[1111111]1111" class="video-title">
                        <a class="activity">活动作品</a>
                        <span class="tit tr-fix">[1111111]1111</span>
                    </h1>
                    <div class="video-data">
                        <span class="a-crumbs">
                            <a>鬼畜</a>
                            <a>人力VOCALOID</a>
                        </span>
                        <span>2020-03-24 17:30:56</span>
                    </div>
                    <div class="video-data">
                        <span>3.4万播放 ·179弹幕 <i class="fa fa-ban" aria-hidden="true" style="color: #fd676f;"></i>未经作者授权，禁止转载</span>
                    </div>
                </div>
                <div class="player-wrap" style="height: 700px; width: 100%; background: #000;">

                </div>
                <div class="player-bottom">
                    <div class="out">
                        <div class="fl">
                            11人正在看，11条实时弹幕
                        </div>
                        <div class="fr">
                            <input type="search" placeholder="发个弹幕见证下">
                            <span class="fr-button">发送</span>
                        </div>
                    </div>
                </div>
                <div class="player-center">
                    <div class="fl">
                        <span class="video-action">
                            <i class="fa fa-thumbs-up" aria-hidden="true"></i>
                            11
                        </span>
                        <span class="video-action">
                            <i class="fa fa-thumbs-up" aria-hidden="true"></i>
                            11
                        </span>
                        <span class="video-action">
                            <i class="fa fa-thumbs-up" aria-hidden="true"></i>
                            11
                        </span>
                        <span class="video-action">
                            <i class="fa fa-thumbs-up" aria-hidden="true"></i>
                            11
                        </span>
                    </div>
                    <div class="fr">
                        <span class="video-action-right">
                            稿件投诉
                            <i class="fa fa-ellipsis-v" aria-hidden="true"></i>
                        </span>
                    </div>
                </div>
                <div class="player-center-wrap">
                    <div class="player-center-text">
                        各国政府最近几乎每天都在忙着“救市”，<br/><br/><br/><br/>
                        他们手速太快，面馆的视频已经追不上了<br/>
                        写稿的时候，美联储和财政部还在扭捏尺度的问题<br/>
                    </div>
                    <div class="player-center-button">
                        <ul>
                            <li>全能打卡挑战</li>
                            <li>金融</li>
                            <li>经济学</li>
                            <li>疫情防控</li>
                            <li>美联储</li>
                            <li>巴菲特</li>
                            <li>股票</li>
                            <li>美股</li>
                            <li>救市</li>
                            <li><i class="fa fa-plus" aria-hidden="true"></i></li>
                        </ul>
                    </div>
                </div>
                <div class="border">
                    <span class="fl">
                        投稿5篇分50万，集赞50得大会员
                    </span>
                    <div class="fr">
                        <a href="#">
                            <img src="img/eZSKwhspD_w320_h100.jpg">
                        </a>
                    </div>
                </div>
                <div class="player-bottom-button">
                    <i class="fa fa-volume-up" aria-hidden="true" style="margin-right: 5px"></i>
                    限时4.6折开通大会员 开通>>
                    <i class="fa fa-times fr" aria-hidden="true"></i>
                </div>
                <div class="player-text">
                    <div class="player-text-data fl">
                        <ul class="inline-ul">
                            <li style="margin-right: 16px;">按时间排行</li>
                            <li>按热度排行</li>
                        </ul>
                    </div>
                    <div class="player-text-wrap fr">
                        <ul class="inline-ul inline-ul-large">
                            <li>共27页</li>
                            <li>1</li>
                            <li>2</li>
                            <li>3</li>
                            <li>4</li>
                            <li>...</li>
                            <li>27</li>
                            <li>下一页</li>
                        </ul>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="comment">
                    <div class="face">
                        <img src=img/noface.jpg@52w_52h.webp>
                    </div>
                    <div class="textarea">
                        <textarea cols="60" rows="5" placeholder="请自觉遵守互联网相关的政策法规，严禁发布色情、暴力、反动的言论。" class="textarea-text"></textarea>
                        <button type="submit" class="comment-submit">发表评论</button>
                    </div>
                    <div class="emoji">
                        <i class="fa fa-smile-o" aria-hidden="true"></i>
                        <span>表情</span>
                    </div>
                </div>
                <div class="comment-list-1" style="margin-bottom: 50px">
                    <div class="head fl" style="width: 85px; height: 85px;">
                        <img src="img/eda7af362135448c0d38cfaeecc5872f7a85c6bf.jpg@52w_52h.webp" style="border-radius: 50%"/>
                        <button class="like">关注</button>
                    </div>
                    <div class="fl">
                        <div class="user">
                            <span class="stick">UP</span>
                            <span><b>后期喵</b></span>
                        </div>
                        <div style="margin-bottom: 10px">
                            以为随便在剧场版里截一段就能投自制吗？兄弟萌！三连上去，让更多人举报
                        </div>
                        <div>
                            <ul class="inline-ul inline-ul-x-large" style="font-size: 12px; color: #777">
                                <li>来自安卓客户端</li>
                                <li>2020-01-14 10:29</li>
                                <li><i class="fa fa-thumbs-up"></i>5708</li>
                                <li><i class="fa fa-thumbs-down"></i></li>
                                <li>回复</li>
                            </ul>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
            </div>
            <div class="body_right">
                <div class="head fl" style="margin-right: 15px;">
                    <img src="img/eda7af362135448c0d38cfaeecc5872f7a85c6bf.jpg@52w_52h.webp" style="border-radius: 50%"/>
                </div>
                <div class="head-text" style="font-size: 14px">
                    <div><span class="user-id">红色激情</span><i class="fa fa-envelope" aria-hidden="true"></i>发消息</div>
                    <p>华农兄弟御用鬼畜师-海绵宝宝系列-稳定更新(#^.</p>
                </div>
                <div style="margin-top: 10px;">
                    <button type="button" class="like" style="border: 1px solid #FB7299; color: #FB7299; background: transparent; min-width: 90px;padding: 8px;">充电</button>
                    <button type="button" class="like" style="border: 0; padding: 9px 40px;">
                        <i class="fa fa-plus" aria-hidden="true"></i>关注11.1万
                    </button>
                </div>
                <div class="border-right">
                    <div style="margin-left: 15px;">弹幕列表<i class="fa fa-ellipsis-v" aria-hidden="true" style="margin-left: 15px;"></i>
                        <span class="fr">展开</span>
                    </div>
                </div>
                <p class="body_right-title">相关推荐</p>
                <div class="video-wrap">
                    <div style="margin-bottom: 10px;">
                        <img src="img/7cee31977deb39f297d2d2598e736d26ed337568.jpg@336w_190h.webp" class="fl">
                        <span>【川普】我还是曾经那个少年</span>
                        <p>鲨然鲨然</p>
                        <p>120.0万播放 · 1.1万弹幕</p>
                    </div>
                    <div style="margin-bottom: 10px;">
                        <img src="img/7cee31977deb39f297d2d2598e736d26ed337568.jpg@336w_190h.webp" class="fl">
                        <span>最近火爆全网的《少年》，你喜欢吗？</span>
                        <p>猫耳半圆</p>
                        <p>104.5万播放 · 6649弹幕</p>
                    </div>
                    <div style="margin-bottom: 10px;">
                        <img src="img/7cee31977deb39f297d2d2598e736d26ed337568.jpg@336w_190h.webp" class="fl">
                        <span>最近火爆全网的《少年》，你喜欢吗？</span>
                        <p>猫耳半圆</p>
                        <p>104.5万播放 · 6649弹幕</p>
                    </div>
                    <div style="margin-bottom: 10px;">
                        <img src="img/7cee31977deb39f297d2d2598e736d26ed337568.jpg@336w_190h.webp" class="fl">
                        <span>最近火爆全网的《少年》，你喜欢吗？</span>
                        <p>猫耳半圆</p>
                        <p>104.5万播放 · 6649弹幕</p>
                    </div>
                    <div style="margin-bottom: 10px;">
                        <img src="img/7cee31977deb39f297d2d2598e736d26ed337568.jpg@336w_190h.webp" class="fl">
                        <span>最近火爆全网的《少年》，你喜欢吗？</span>
                        <p>猫耳半圆</p>
                        <p>104.5万播放 · 6649弹幕</p>
                    </div>
                    <div class="border-right" >展开</div>
                </div>
            </div>
        </div>
    </div>


</body>
</html>
